<template>
  <view class="universal-detail">
    <view class="universal-detail-top">
      <view class="universal-detail-top-time"><text class="universal-detail-top-title">上报</text> {{ model.createTime }}</view>
      <view class="universal-detail-top-username">发现人：{{ model.discovererName }}</view>
    </view>
    <view class="universal-detail-cont">
      <view class="universal-detail-item">
        <view class="universal-detail-item-title">隐患来源：</view>
        <view class="universal-detail-item-cont">{{ model.source ? model.source.label : '-' }}</view>
      </view>
      <view class="universal-detail-item">
        <view class="universal-detail-item-title">关联设备：</view>
        <view class="universal-detail-item-cont">
          {{ model.relatedEquipment?.map((it) => it.name).join('、') }}
        </view>
      </view>
      <view class="universal-detail-item">
        <view class="universal-detail-item-title">发现时间：</view>
        <view class="universal-detail-item-cont">{{ model.discoverTime }}</view>
      </view>
      <view class="universal-detail-item w-full">
        <view class="universal-detail-item-title">隐患描述：</view>
        <view class="universal-detail-item-cont">{{ model.desc || '-' }}</view>
      </view>
      <view class="universal-detail-item">
        <view class="universal-detail-item-title">隐患照片：</view>
        <view class="universal-detail-list">
          <image v-for="(image, index) in model.convertPicUrl" :src="image.url" mode="aspectFit" @click="handleImagePreview(image.url, index)" class="universal-detail-list-image"></image>
        </view>
      </view>
      <view class="universal-detail-item">
        <view class="universal-detail-item-title">隐患视频：</view>
        <view class="universal-detail-list">
          <video-preview v-for="(image, index) in model.convertPatrolVideoId" :src="image.url"></video-preview>
		      <view v-if="!model.convertPatrolVideoId?.length">-</view>
        </view>
      </view>
    </view>
  </view>
</template>

<script setup>
import { showImagePreview } from 'vant';
const model = defineModel();

const handleImagePreview = (imageUrl, index) => {
  console.log('imageList', imageUrl);
  showImagePreview({
    images: [imageUrl],
    startPosition: index,
    closeOnClickImage: false,
  })
}
</script>

<style lang="scss" scoped>
@import '@/assets/universal-detail.scss';
</style>